<!DOCTYPE html>
<html>
  <head><title>Basic Authentication</title></head>
  <body>
    <h1>Basic Authentication</h1>
    <input type="text"     id="user" placeholder="Username">
    <input type="password" id="pass" placeholder="Password">
    <button onclick="getMyProfile()">Get My Profile</button>

    <p id="result"></p>

    <script>
      async function () {
        const user = document.getElementById('user').value;
        const pass = document.getElementById('pass').value;

        const response = await fetch('/profile/me', {
          headers: {
              'Authorization': 'Basic ' + btoa(user + ':' + pass)
          }
        });

        document.getElementById('result').innerHTML = await response.text();
      }
    </script>
  </body>
</html>
